<template>
	<view>
		<u-sticky bgColor="#6492FF" offsetTop=0 customNavHeight=0>
			<navbox title="联系上级"></navbox>
		</u-sticky>
		<view class="con">
			<view class="con__title">
				我的上级
			</view>
			<view class="con__box">
				<view class="con__box__item">
					<view class="con__item__label">
						头像
					</view>
					<image :src="user.headUrl?user.headUrl:'/static/img/team/tx.png'" class="con__box__item__tx" mode="aspectFill"></image>
				</view>
				<view class="con__box__item">
					<view class="con__item__label">
						姓名
					</view>
					<view class="con__box__item__value">
						{{user.name}}
					</view>
				</view>
				<view class="con__box__item">
					<view class="con__item__label">
						手机号：
					</view>
					<view class="con__box__item__value">
						{{user.tel}}
						<view class="con__box__item__btn" @click="call">
							拨打
						</view>
					</view>
				</view>
				<view class="con__box__item">
					<view class="con__item__label">
						微信号：
					</view>
					<view class="con__box__item__value">
						{{user.wechatNo}}
						<view class="con__box__item__btn" @click="copy(user.wechatNo)">
							复制
						</view>
					</view>
				</view>
				<view class="con__box__item">
					<view class="con__item__label">
						QQ号：
					</view>
					<view class="con__box__item__value">
						{{user.qqNo}}
						<view class="con__box__item__btn" @click="copy(user.qqNo)">
							复制
						</view>
					</view>
				</view>
			</view>
			<view class="con__footer">
				<u-button text="意见与反馈" @click="navto('/pages/my/advice')" color="#6492FF" shape='circle'></u-button>
			</view>
			<view class="ms">
				长期联系不到上级，请点击意见与反馈
			</view>
		</view>
	</view>
</template>

<script>
	import {superLink} from '@/api/user.js'
	export default {
		data() {
			return {
				user:{}
			};
		},
		onLoad() {
			superLink().then(res=>{
				if(res.data.code==200){
					this.user=res.data.data
				}
			})
		},
		methods:{
			call(){
				uni.makePhoneCall({
					phoneNumber: this.user.tel //仅为示例
				});
			}
		}
	}
</script>

<style lang="scss">
	page{
		background-color: #f6f6f6;
		
	}
.con{
	padding: 25rpx 16rpx;
	&__title{
		font-family: Source Han Sans SC;
		font-weight: 400;
		font-size: 33rpx;
		color: #3E3D3D;
		line-height: 33rpx;
		margin-bottom: 24rpx;
	}
	&__box{
		background: #FFFFFF;
		border-radius: 14rpx;
		padding: 30rpx 40rpx 50rpx;
		&__item{
			display: flex;
			align-items: center;
			justify-content: space-between;
			height: 70rpx;
			&__label{
				font-family: Source Han Sans SC;
				font-weight: 400;
				font-size: 26rpx;
				color: #3E3D3D;
				line-height: 26rpx;
				
			}
			&__value{
				font-family: Source Han Sans SC;
				font-weight: 400;
				font-size: 26rpx;
				color: #707070;
				display: flex;
				align-items: center;
				
			}
			&__tx{
				width: 54.86rpx;
				height: 54.86rpx;
				border-radius: 50%;
			}
			&__btn{
				width: 83rpx;
				height: 47rpx;
				border-radius: 24rpx;
				border: 1rpx solid #6492FF;
				display: flex;
				align-items: center;
				justify-content: center;
				font-family: Source Han Sans SC;
				font-weight: 400;
				font-size: 25rpx;
				color: #6492FF;
				margin-left: 10rpx;
			}
		}
		
	}
	&__footer{
		padding: 22rpx 96rpx;
		
	}
}
.ms{
	text-align: center;
	font-family: Source Han Sans SC;
	font-weight: 400;
	font-size: 25rpx;
	color: #707070;
	line-height: 25rpx;
}
</style>
